<template>
  <div class="app">
    <merchantHeader/>
    <div class="back">
      <div class="con">
        <div class="pxes"></div>
        <div class="listneo">
          <businessL />
          <div class="conres">
            <div class="ra">
              <h3>体验报告详情</h3>
            </div>
            <div class="yuansdj">
              <el-row style="margin-top:15px">
                <el-col :offset="19" :span="5">
                  <div class="tubiao">评优</div>
                </el-col>
              </el-row>
              <el-row style="margin:15px 0px">
                <el-col :span="12">
                  <span style="color:rgb(180,180,180)">活动编码:</span>
                  <span>{{coding}}</span>
                </el-col>
                <el-col :span="12">
                  <span style="color:rgb(180,180,180)">产品名称:</span>
                  <span>{{product}}</span>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <span style="color:rgb(180,180,180)">报告提交时间:</span>
                  <span>{{dates}}</span>
                </el-col>
                <el-col :span="12">
                  <span style="color:rgb(180,180,180)">报告提交人</span>
                  <span>{{user}}</span>
                </el-col>
              </el-row>
              <h4 style="font-size:17px;margin-top:15px">体检官背景:</h4>
              <el-form label-width="120px">
                <el-form-item label="职业:">{{occupation}}</el-form-item>
                <el-form-item label="兴趣喜好:">{{interest}}</el-form-item>
                <el-form-item label="性别:">{{sex}}</el-form-item>
                <el-form-item label="身高:">{{stature}}</el-form-item>
                <el-form-item label="体重:">{{weight}}</el-form-item>
                <el-form-item label="年龄:">{{age}}</el-form-item>
                <el-form-item label="星座:">{{constellation}}</el-form-item>
                <el-form-item label="风格喜好:">{{styles}}</el-form-item>
                <el-form-item label="面料/材质喜好:">{{texture}}</el-form-item>
                <el-form-item label="肤质:">{{skin}}</el-form-item>
                <el-form-item label="皮肤问题:">{{problem}}</el-form-item>
                <el-form-item label="产品体验详情:">{{experience}}</el-form-item>
                <el-form-item label="产品亮点推荐:">{{bright}}</el-form-item>
                <el-form-item label="产品优化建议:">{{optimize}}</el-form-item>
                <el-form-item label="体验感评分:">
                  <el-rate v-model="ranking" disabled :max=10></el-rate>
                </el-form-item>
              </el-form>
            </div>
            <businessF />
          </div>
        </div>
      </div>
    </div>
    <Footer />
  </div>
</template>
<script>
import merchantHeader from "@/components/merchantHeader";
import Footer from "@/components/Footer";
import businessL from "@/components/businessL";
import businessF from "@/components/businessF";
export default {
  components: {
    merchantHeader,
    Footer,
    businessL,
    businessF
  },
  data() {
    return {
      coding: 10254125541,
      product: "简柏格女包牛皮2019新款",
      dates: "2019-12-02",
      user: "风中有朵雨做的云",
      occupation:"医生",
      interest:"敲代码",
      sex:"男",
      stature:"190cm",
      weight:"80kg",
      age:18,
      constellation:"天蝎座",
      styles:"简约",
      texture:"冰丝",
      skin:"干燥",
      problem:"缺水",
      experience:"特别好，50字以上",
      bright:"便宜，限200字",
      optimize:"实惠点，限200字",
      ranking:7
    };
  },
  methods: {}
};
</script>
<style scoped>
.app /deep/ .ist_l .ist_c li:nth-child(1) {
  background-color: #ff9381;
  width: 126px;
  height: 50px;
  display: block;
}

.back {
  background-color: #f06048;
}
.pxes {
  height: 15px;
}
.back .con {
  width: 1200px;
  margin: 0 auto;
  background-color: #eee;
  padding-bottom: 10px;
}
.listneo {
  width: 1161px;
  margin: 0px auto;
  display: flex;
  justify-content: space-between;
}
.conres {
  width: 902px;
  border-radius: 6px;
  background-color: #fff;
}
.conres .ra h3 {
  font-size: 20px;
  color: #f06048;
  padding-left: 14px;
  border-bottom: 1px solid #cecece;
  margin-top: 15px;
  padding-bottom: 20px;
}
.yuansdj {
  width: 95%;
  margin: 0 auto;
}
.el-form-item{
  margin-bottom:0px
}
.el-rate{
  line-height:50px
}
.tubiao{
  width: 35px;
  height: 35px;
  background-color: rgb(240, 96, 72);
  border-radius: 50%;
  line-height: 35px;
  text-align: center;
  color: white;
}
</style>